<!-- 本示例未包含完整css，获取外链css请参考上文，在hello uni-app项目中查看 -->
<template>
	<view>
		<view>
			<form @submit="formSubmit" @reset="formReset">
				<view class="uni-form-item uni-column">
					<view class="title">抬头类型</view>
					<radio-group name="invoiceType" @change="radioChange">
						<label>
							<radio value="1" /><text>企业单位</text>
						</label>
						<label>
							<radio value="2" /><text>个人/非企业</text>
						</label>
					</radio-group>
				</view>
				<view class="uni-form-item uni-column">
					<view class="title">发票抬头</view>
					<input class="uni-input" name="title" placeholder="请输入发票抬头" />
				</view>
				<view class="uni-form-item uni-column" v-if="type == 1">
					<view class="title">税号</view>
					<input class="uni-input" name="taxNumber" placeholder="请输入税号" />
				</view>
				<view class="uni-form-item uni-column">
					<view class="title">备注</view>
					<input class="uni-input" name="remark" placeholder="请输入备注" />
				</view>
				<view class="uni-form-item uni-column">
					<view class="title">邮箱</view>
					<input class="uni-input" name="email" placeholder="请输入邮箱" />
				</view>
				<view class="uni-form-item uni-column" v-if="type == 1">
					<view class="title">地址</view>
					<input class="uni-input" name="address" placeholder="请输入地址" />
				</view>
				<view class="uni-form-item uni-column">
					<view class="title">电话</view>
					<input class="uni-input" name="address" placeholder="请输入电话" />
				</view>
				<view class="uni-form-item uni-column" v-if="type == 1">
					<view class="title">开户行</view>
					<input class="uni-input" name="bank" placeholder="请输入开户行" />
				</view>
				<view class="uni-form-item uni-column" v-if="type == 1">
					<view class="title">银行账号</view>
					<input class="uni-input" name="bankAccount" placeholder="请输入银行账号" />
				</view>
				<view class="uni-btn-v" style="position: relative;top: 40rpx;">
					<button type="primary" form-type="submit">提交电子发票</button>
				</view>
			</form>
		</view>
	</view>
</template>


<script>
	export default {
		data() {
			return {
				type: 1,
				orderId: null,
			}
		},
		onLoad(e) {
			this.orderId = e.orderId
		},
		methods: {
			radioChange(e) {
				console.log(e.detail.value);
				if (e.detail.value == 1) {
					this.type = 1
				} else {
					this.type = 2
				}
			},
			formSubmit(e) {
				var formData = e.detail.value
				formData.orderId = this.orderId
				if (!formData.invoiceType) {
					uni.showToast({
						title: '请选择抬头类型',
						icon: 'none'
					})
					return
				}
				if (!formData.title) {
					uni.showToast({
						title: '请输入抬头',
						icon: 'none'
					})
					return
				}
				
				if (this.type == 1) {
					if (!formData.taxNumber) {
						uni.showToast({
							title: '请填写税号',
							icon: 'none'
						})
						return
					}
				}

				if (!formData.email) {
					uni.showToast({
						title: '请填写邮箱',
						icon: 'none'
					})
					return
				}
				this.$u.post(`/vehicleService/invoice/create`, formData).then(res => {
					uni.showToast({
						title: '开票成功',
						icon: 'none'
					})
					setTimeout(()=>{
						uni.navigateTo({
							url: '/pages/center/index'
						})
					},1500)
				})

			},
		}
	}
</script>
<style>
	.uni-form-item .title {
		width: 140rpx;
		text-align: right;
		padding: 20rpx 0;
		margin-right: 14rpx;
	}

	.uni-form-item {
		display: flex;
		align-items: center;
		margin-top: 14rpx;
	}
</style>